<div class="modal fade bs-modal-md" id="modelContent">
	<div class="modal-dialog modal-md">
        <div class="modal-content"></div>
    </div>
</div> 
<div class="portlet box green">
	<div class="portlet-title">
		<div class="caption">
			<i class="fa fa-cog"></i>查询内容
		</div>
		<div class="tools">
			<a href="javascript:;" class="collapse right" data-original-title=""title=""> </a>
		</div>
		<div class="actions">
			<a href="javascript:;" class="btn white btn-sm ajax-search"><iclass="fa fa-search"></i> 查询 </a> 
			<a href="javascript:;"class="btn white btn-sm search-reset"><i class="fa fa-eraser"></i>清除 </a>
			<a  href="/company/list" class=" btn-left btn white btn-sm ajaxify"><i class="fa fa-mail-reply"></i> 返回</a>
		</div>
	</div>
	<div class="portlet-body form">
		<form action="/departmentsCompany/list" class="form-horizontal" method="get" id="searchForm" onsubmit="return false">
			<div class="form-body">
				<div class="row">
					<div class="form-group">
						<div class="col-md-3">
							<label class="col-md-4 control-label">企业ID：</label>
							<div class="col-md-8">
								<select class="js-data-company-ajax form-control" name="companyId">
								</select>
							</div>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
</div>
<div class="portlet box green">
    <div class="portlet-title">
		<div class="caption"><i class="fa fa-cogs"></i>数据列表</div>
		<div class="tools"><a href="javascript:;" class="collapse" data-original-title="" title=""> </a></div>
		<div class="actions">
			#if($!companyId)
			<a href="#modelContent" thref="/departmentsCompany/add?companyId=$!companyId" class="btn white btn-sm ajax-model-get" data-toggle="modal"><i class="fa fa-plus"></i> 新增 </a>
			#end
		</div>
    </div>
     <div class="portlet-body">
    	<div class="dataTables_wrapper no-footer">
			<div class="table-scrollable">
			   <table class="table table-striped table-bordered table-hover" id="tableCategory">
				  	<thead>
						<tr>
							<th>部门名称</th>
							<th>启用</th>
							<th>相关人</th>
							<th>部门负责人</th>
							<th>新增时间</th>
							<th class="col-md-3">操作</th>
						</tr>
					</thead>
					<tbody>
					#foreach($item in $!list)
					<tr data-tt-id="$!item.id"  data-tt-parent-id="$!item.pid" id="$!item.id">
		  					<td>$!item.title</td>
		  					<td>#if($item.state)
		  							<span>  √ </span>
		  						#else
		  							<span>  × </span>
		  						#end
		  					</td>
		  					<td><a   href="/departmentsCompany/staffList?departmentId=$!item.id&companyId=$!item.companyId" class="ajaxify" >查看</a></td>
		  					<td>$!item.responsiblePerson</td>
		  					<td>$!item.createDate</td>
			    			<td>
						    	<a class="btn green btn-outline btn-sm ajax-model-get" data-toggle="modal"
									href="#modelContent" thref="/departmentsCompany/edit?id=$!item.id"> 
									<i class="fa fa-edit"></i>修改
								</a>
								
								<a  class="btn green btn-outline btn-sm ajax-editState State"  data-state=$item.state  href="javascript:;" thref="/departmentsCompany/editDepartmentState?id=$!item.id">
									#if($item.state)
									<i class="fa fa-tags"></i>禁用	
									#else	
									<i class="fa fa-tags"></i>启用	
									#end		
								</a>
								
								<a class="btn green btn-outline btn-sm ajax-delete" 
									href="javascript:;" thref="/departmentsCompany/deleteDepartment?id=$!item.id">
									<i class="fa fa-trash"></i>删除
								</a>
								<a  href="#modelContent" thref="/departmentsCompany/add?id=$!item.id&companyId=$!companyId" class="btn green btn-outline btn-sm ajax-model-get" data-toggle="modal">
									<i class="fa fa-plus-square-o"></i>新增下级部门
								</a>
						    </td>		  			
		  				</tr>
					#end
					</tbody>
				</table> 
			</div>
		</div>
    </div>
</div>
<script type="text/javascript">
ComponentsTypeahead.init({url:"departmentsCompany/typeahead",updater:function(item){
	return item.split(",")[0];
}});
$("#tableCategory").treetable({
	expandable : true,
	onInitialized : function(){
		 
	},
	onNodeExpand: function(){
		 
	},
});

function fact(unm){
	var list = new Array();
	list.push(unm);
	var parentId=$("[ data-tt-parent-id = "+unm+"]");
	if(parentId.length > 0){
		$.each(parentId,function(i,data){
			var child =$(data).attr("data-tt-id");
			var children=fact(child);
			if(children.length>0){
				Array.prototype.push.apply(list, children);
			}
		})
	}
	return list;
}

$(".State","#tableCategory").on("click",function(){
	var dataId=$(this).parents("tr").attr("data-tt-id");	
	var aState=$(this).attr("data-state");
	
 	$.each(fact(dataId),function(i,data){
 		var nodeID=$("[data-tt-id="+data+"]");
 		var tdState =nodeID.children("td:eq(1)").html("");
 		var tayget=nodeID.children("td:eq(5)").children(".State").html("");
 		if(aState == "true"){
 			tayget.html("<i class='fa fa-tags'></i> 启用	");
 			tayget.attr("data-state","false");
 			tdState.html("<span>  × </span>");
 		}else{
 			tayget.html("<i class='fa fa-tags'></i> 禁用	");
 			tayget.attr("data-state","true");
 			tdState.html("<span>  √ </span>");
 		}
 		
 	});
})

function formatRepoSelection(repo) {
	return   repo.id;
}

function formatCompany(repo){
	  if (repo.loading) {
		    return repo.text;
	  }
	  var markup = "<div class='select2-result-repository clearfix'>"
					    + "<div class='select2-result-repository__avatar'><img src= 'assets/images/default.png' /></div>"
		 			 	+ "<div class='select2-result-repository__meta'>"
		 			 		+ "<div class='select2-result-repository__title'>" + repo.name+"</div>"
		 			 		+ "<div class='select2-result-repository__description'>等级："+ repo.level + "</div>"
		 			 		+ "<div class='select2-result-repository__stargazers'><i class='fa fa-star'></i>  专管员  ："+ repo.specialManager+ "</div>"
		 			 		+ "<div class='select2-result-repository__watchers'><i class='fa fa-eye'></i>企业地址："+repo.city + repo.address+ " Watchers</div>"
		 			 	+ "</div>"
		 			+"</div>";
	  return markup;
}

$(".js-data-company-ajax").select2({
	ajax : {
		url : "companyMember/getCompany",
		 dataType: 'json',
		delay : 250,
		async : false,
		data : function(params) {
			return {
				str:params.term,
				pageNo : params.page||1
			};
		},
		processResults: function (data, params) {
		    params.page = params.page || 1;

		    return {
		        results: data.result,
		        pagination: {
		            more: (params.page * 10) < data.totalCount
		        }
		    };
		},
		cache : true
	},
	width : "off",
	escapeMarkup : function(markup) {
		return markup;
	},
	placeholder:'请选择',
	minimumInputLength : 1,
	language: "zh-CN",  
	templateResult : formatCompany,
	templateSelection : formatRepoSelection
});
</script>